<template>
  <view class="container">
    <text>{{ name }}</text>
    <button type="button" @click="changeName">改变</button>
    <button type="button" @click="login">登录</button>

    <text class="test-color">test color css</text>
  </view>
</template>

<script setup lang="ts">
import api from "@/api";
import { ref } from "vue";
const name = ref("zds");

const obj: Types.User.ILogin = {
  account: "zds",
  password: "123456a"
};

const changeName = () => {
  name.value = "张德帅";
  console.log("obj =>", obj);
};

const login = () => {
  api.user.login(obj).then((res) => {
    console.log("login =>", res);
  });
};
</script>

<style scoped>
.container {
  padding: 20px;
  font-size: 14px;
  line-height: 24px;
}

.test-color {
  color: var(--app-bg-color);
}
</style>
